<template>
  <div>
    <!--首页轮播图 -->
    <home-banner :banners="banners"></home-banner>
      
    <!-- 视频列表 -->
    <video-list :videoList="videoList"></video-list>

    <!-- 底部导航 -->
    <common-footer></common-footer>
  </div>
</template>




<script>
import HomeBanner from "./Component/Banner";
import VideoList from "./Component/VideoList";
import CommonFooter from "@/components/CommonFooter";
import {videoBannerList,videoList} from "@/api/getData.js";

export default {
  //注册组件
  components: {
    HomeBanner,
    VideoList,
    CommonFooter
  },
  //声明数据源
  data() {
    return {
      banners: [],
      videoList: []
    };
  },
  //定义方法
  methods: {

     // 获取轮播图数据
    async getVideoBannerList() {
      try {
        const result = await videoBannerList()
        if (result.data.code == 0) {
          this.banners = result.data.data
        }
      }catch(error){
          console.log(error)
      }
    },

    //获取视频列表
    async getVideoList(){
        try{
            const result = await videoList()
            if (result.data.code == 0) {
                this.videoList = result.data.data;
            }
        }catch(error){
            console.log(error)
        }
    }
  },
  mounted(){
      //页面渲染完成调用方法获取数据
      this.getVideoBannerList();
      this.getVideoList()
  }
};
</script>


<style lang="scss" scoped>
</style>